<template>
  <div class="video-item">
    <el-card :body-style="{ padding: '0px' }">
      <VideoCoverRoute url="2332" :uvid="3"></VideoCoverRoute>
      <div class="info">
        <div class="headline">
          <span class="type hide">这里是视频所属的分区</span>
          <router-link
            :to="{ name: 'video', params: { videoId: 0 } }"
            target="_blank"
            class="video-link"
          >
            这里是视频标题内容哦那个2131231233331221331232
          </router-link>
        </div>
        <div class="des hide">这里填的是视频的简介信息</div>
        <!-- <div class="tags">
          <span title="观看" class="so-icon watch-num" style="float: left;">
            <i class="el-icon-video-play"></i>
            51.4万
          </span>
          <span title="上传时间" class="so-icon time" style="float: right;">
            <i class="el-icon-time"></i>
            2021-07-23</span><br/>
          <span title="上传者" class="so-icon" style="float: left;">
            <i class="el-icon-user"></i>
            <router-link
              :to="{ name: 'account', params: { uuid: 0 } }"
              target="_blank"
              class="up-link"
            >
              上传人
            </router-link>
          </span>
        </div> -->
      </div>
    </el-card>
  </div>
</template>

<script>
import VideoCoverRoute from "../common/VideoCoverRoute.vue";
export default {
  components: { VideoCoverRoute },
  props: {
    videoObj: {
      type: Object,
    },
  },
};
</script>
<style lang="scss" scoped>
.video-item {
  float: left;
  // margin-right: 32px;
  margin-top: 20px;
}
.info {
  padding-left: 10px;
  padding-right: 10px;
  .headline {
    margin-bottom: 12px;
    height: 45px;
    overflow: hidden;
    .video-link {
      font-size: 14px;
      word-break: break-all;
      line-height: 18px;
      margin: 10px 5px 8px;
      overflow: hidden;
      text-overflow: ellipsis;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      font-weight: 500;
    }
  }
  .so-icon {
    margin-right: 8px;
    margin-bottom: 12px;
    font-size: 12px;
    height: 12px;
    line-height: 16px;
    vertical-align: text-top;
    position: relative;
    .up-link {
      word-break: break-all;
      // margin: 2px 2px 8px;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
  }
  .so-icon.watch-num {
    width: 41px;
    overflow: inherit;
    white-space: nowrap;
  }
  .time {
    margin-right: 0;
    width: 78px;
  }
}
</style>